<template>
	<div style="margin-top: 0;">
	<!-- <div style="margin-top: 0;" v-wechat-title="$route.meta.title=name"> -->
		<div v-if='errcode == 0 || errcode ==0'>
			<!-- 播放器 -->
			<div class="video-c">
			  <div id="MPSplayer"></div>
			</div>
			<!-- <div class="video-pic" @click="picclick">
				<img src="static/img/nozbolad.png" alt="">
			</div> -->
			<!--聊天-->
	    <div class="centera">
				<div id="oranger" class="tab_liveTxt">
					<div class="orangerleft">
						<a class="hover" href="javascript:;" @click="bijiclick(0)">聊天室</a>
						<a href="javascript:;" @click="bijiclick(1)">简介</a>
						<a href="javascript:;" @click="bijiclick(2)">笔记</a>
					</div>
					<div class="orangerright">
					  <img src="../../../src/assets/img/shouye/yan.png" alt="">
                      <span>{{hits}}</span>
		            </div>
				</div>
				<div class="orangerdesc">
					<div id="tablea" class="tablea descoactive">
						<div class="box">
							<!--聊天-->
							<div class="tis-container chat-box">
							</div>
						</div>
						<div class="box class_intro"></div>
					</div>
					<!-- 课程简介 -->
					<div class="descor descoactive" id="descoactive1" v-html="description"></div>
					<!-- 笔记 -->
					<div class="descor descoactive">
						<!-- <div v-if="bijiarr.length!=0||bijiarr.length!='0'"> -->
							<!-- <mt-loadmore :bottom-method="loadBottom"  :bottom-all-loaded="allLoaded" ref="loadmoredetail"> -->
							<mescroll-vue ref="mescroll0" :up="getMescrollUp(0)" @init="mescrollInit0">
							   <div id="dataList">
									<div class="descorevery" v-for="(item,index) in tab0.list">
										<div class="descopic">
											<img v-if="item.avatar!=''" :src='item.avatar' alt="">
											<img v-else :src='avatarimg' alt="">
										</div>
										<div class="descotime">
											<p class="descname">{{item.nickname}}</p>
											<p class="descname-time">{{item.addtime}}</p>
											<p class="desccontent">{{item.content | base64Decode}}</p>
											<div class="desczan" @click="bijizan(item.id,item.is_praise,index)" v-if="item.is_praise==0||item.is_praise=='0'">
												<img src="../../../src/assets/img/buy/huizan.png" alt="">
												<span class="zan">{{item.praise}}</span>
											</div>
											<div class="desczan" @click="bijizan(item.id,item.is_praise,index)" v-else>
												<img src="../../../src/assets/img/buy/zan.png" alt="">
												<span class="zanactive">{{item.praise}}</span>
											</div>
										</div>
									</div>
								</div>
							</mescroll-vue>
						<!-- </div>
						<div v-else>
							<div class="chen-kongpicactive" style="margin-top: 2rem;">
								<img src="static/img/nopinlun.png" mode=""></img>
							</div>
							<div class="chen-kong-text"><span>暂时还没有内容</span></div>
						</div> -->
					</div>
				</div>
			</div>
			 <!--排行榜图片-->
			  <!-- <img src="static/img/kechengxiangqing/paihangbang.png" alt="" class="paihang" @click="paihang()" v-if="active==0"> -->
			  <!--笔记图片-->
			  <img src="../../../src/assets/img/kechengxiangqing/biji.png" alt="" class="bj" @click="biji()" v-if="active == 2||active == '2'">
			  <!--答题图片-->
			  <div v-else>
				<div v-if="cid!=''">
					<div v-if="register_time==0||register_time=='0'||is_signed == 1 || is_signed == '1'">
					<!-- <div v-if="nowdata >= register_time"> -->
					  <img v-if="is_signed == 0 || is_signed == '0'" @click="registerclick()" src="../../../src/assets/img/kechengxiangqing/qiandao.png" alt="" class="dati">
					  <img  v-else-if="(answer_time == 0 || answer_time == '0')&& (test_id != 0 ||test_id != '0')"  @click="answerclick" src="../../../src/assets/img/kechengxiangqing/dati.png" alt="" class="dati">
					</div>
				</div>
			  </div>
			  
			
			  <!--笔记弹窗-->
			  <mt-popup v-model="popupVisible1" popup-transition="popup-fade" style="width: 100%;height: 100%;background:rgba(0,0,0,.1);z-index: 99999999;">
			      <div style="width: 92%;height:6rem;margin: auto;background: #fff;border-radius: 0.08rem;top: 230px;position:relative;z-index: 9999999999;">
			
			        <div class="biji">
			          <p>添加笔记</p>
					  <!-- <div class="bijicolo"> -->
						<textarea name="" id="" v-model="bijitext" placeholder="请添加您的笔记或自己的领悟" maxlength='200'></textarea>
						<div class="textbiji">{{bijitext.length}}/200</div>
					  <!-- </div> -->
			          <div class="btons">
			            <button @click="un1()">取消</button>
			            <button @click="un2()">确认</button>
			          </div>
			        </div>
			      </div>
			  </mt-popup>
			  
			  <!-- 您已试看过该课程 -->
			  <div class="shoewr-chenshi">
			  	<div class="chen-contener chen-textactiveshi" style="top: 4.5rem;">
			  		<p class="chen-title">提示</p>
			  		<p class="chen-text chen-textshi">本次试看已经结束</p>
			  		<p class="chen-button-shiyes" @click="shishare()">确定</p>
			  	</div>
			  </div>
			  
			  <!-- 登录弹窗 -->
			  <div class="datishower">
				  
					<div class="containerpicdati">
						<div class="chen-contener1 chenpass">
							<p class="chen-title">提示</p>
							<p class="chen-text chen-textactive">你已经答过该试卷</br>是否要重新答题</p>
							<div class="chen-but">
								<p class="chen-but-no" @click="butclick()">重新答题</p>
								<p class="chen-but-yes" @click="nobutclick()">查看解析</p>
							</div>
						</div>
						<div class="closearr" @click="closeclick">
							<img src="../../../src/assets/img/kechengxiangqing/tuichu.png">
						</div>
					</div>
			  </div>
			  
			  <!-- 登录弹窗 -->
			  <div class="shoewr-chenhoupass">
			  	<div class="chen-contener chenpass" style="top: 230px;">
			  		<p class="chen-title">提示</p>
			  		<p class="chen-text chen-textactive">您需要先登录?</p>
			  		<div class="chen-but">
			  			<p class="chen-but-no" @click="repeatclose()">取消</p>
			  			<p class="chen-but-yes chen-but-yesactive" @click="repeatclick()">去登录</p>
			  		</div>
			  	</div>
			  </div>
			  
			</div>
				<!-- 请稍后在试 -->
			<div class="wrong" v-else-if = 'errcode == "-1" || errcode ==-1' >本次试看已结束</div>
			<div class="wrong" v-else>请稍后在试</div>
		</div>
		
</template>

<script>
    // import  Base64 from  '../../assets/js/base64'
	import MescrollVue from 'mescroll.js/mescroll.vue'
		import Vue from 'vue'
		export default {
			components:{
			  MescrollVue
			},
			data() {
				return {
					imgSrc3:require('../../assets/img/kongbai.png'),
					imgSrc: require("../../../src/assets/img/kongbai.png"), 
					imgSrc1: require("../../../src/assets/img/nozbo.png"), 
					urlhtml:'',
					tab0: {mescroll: null, list: [], isListInit: false}, // 全部
					tabType: 0 ,// 菜单类型
					avatarimg:this.$store.state.avatarimg,
					bijitext:'',
					live_status:'', //1 未开始  2正在直播
					zbo:0,   //1是直播
					hits:'',
					active:0,
					popupVisible:false,
					popupVisible1:false,
					url:this.$store.state.url,//接收路由过来的图片地址前缀
					avatar:'',  //头像
					nickname:'',   //昵称
					id:'',  //课程id
					cid:'',  //班级id
					type:'',  //1课程
					errcode:'',
					code:'',
					try:'',   //1试看  0不
					times:'',
					arr:['1','2','3','4','5','6','7','8','6','7','8'],
					zid:'',   //专题id
					getDuration:'',   //视频总时长
					demand_url:'',
					despayer:'',
					special_id:'',  //班级阶段id
					description:'',
					bijiarr:[],
					allLoaded:false,
					page:1,
					nowdata:'',
					register_time:'',  //签到时间
					answer_time:'',   //答题时间
					is_signed:1,  //是否签到  0 没有 1 签了
					is_answered:1,  //是否答题 0 没有 1 有
					test_id:0,  //试卷id
					answer_time1:'',
					setTime1:null,
					setTime:null,
					try_time:'',
					answtype:0,
					urlpath:'',
					phone:'',
					live_platform:1,    //直播平台  1奥点云  2 阿里云   3七牛云
				};
			},
			methods:{
				closeclick(){
					$('.datishower').fadeOut();
				},
				// 点击取消
				repeatclose(){
					$('.shoewr-chenhoupass').fadeOut();
				},
				// 点击去登录
				repeatclick(){
					$('.shoewr-chenhoupass').fadeOut();
					this.d();
				},
				bijiclick(active){
					this.active = active;
					$('.orangerdesc').find('.descoactive').eq(active).show().siblings('.descoactive').hide();
					
					$("#oranger a").eq(active).addClass("hover").siblings().removeClass("hover");
				},
				  biji(){
					if(localStorage.token){
					  this.popupVisible1 = true;
					}else{
					  $('.shoewr-chenhoupass').fadeIn();
					}
				  },
				  un(){
					this.popupVisible = false;
				  },
				  un1(){
					this.popupVisible1 = false;
				  },
				  // 笔记
				  un2(){
					var that = this;
					if(localStorage.token){
						var comm = that.bijitext;
						var bijitext = comm.replace(/\s+/g, "");
						// var bijitext = that.bijitext;
						if(bijitext==''){
							layer.open({
								content: '请添加您的笔记或自己的领悟',
								skin: 'msg',
								time: 2 //1秒后自动关闭
							});
						}else{
							that.popupVisible1 = false;
							if(that.cid!=''){   //班级
								var data = {
									course_id:that.id,
									classroom_id:that.cid,
									special_id:that.special_id,
									type:3,
									content:Base64.encode(bijitext),
								}
							}else if(that.zid!=''){   //专题
								var data = {
									course_id:that.id,
									special_id:that.zid,
									type:2,
									content:Base64.encode(bijitext),
								}
							}else{     //课程
								var data = {
									course_id:that.id,
									type:1,
									content:Base64.encode(bijitext),
								}
							}
							that.axios({
								method:'POST',
								url:that.url+'Note/sendNote',
								data:data,
							}).then((res)=>{
								if(res.data.errcode==0||res.data.errcode=='0'){
									layer.open({
										content: '添加笔记成功',
										skin: 'msg',
										time: 2 //1秒后自动关闭
									});
									// that.page=1
									that.changeTab()
								}else{
									layer.open({
										content: res.data.msg,
										skin: 'msg',
										time: 2 //1秒后自动关闭
									});
								}
							})
						}
					}else{
					  $('.shoewr-chenhoupass').fadeIn();
					}
				  },
				  paihang(){
					this.popupVisible = true;
				  },
				// 试看点击确定
				shishare:function(){
					$('.shoewr-chenshi').fadeOut();
					this.$router.push({
					  path:'/gkx',//tryend为1  试看结束
					  query:{
						id:this.id,
						// tryend:1
					  }
					})
	 			},
				// 获取视频链接
				getvideo:function(id){
					var that = this;
					if(that.cid!=''){   //班级
						var data = {
							id:id,
							pid:that.cid
						}
					}else if(that.zid!=''){   //专题
						if(that.code == ''){
							var data = {
								id:id,
								pid:that.zid
							}
						}else{
							var data = {
								id:id,
								pid:that.zid,
								code:that.code
							}
						}
					}else{     //课程
						if(that.code == ''){
							var data = {
								id:id
							}
						}else{
							var data = {
								id:id,
								code:that.code
							}
						}
					}
					this.axios({
						method:'get',
						url:that.url+'LiveCourse/getUrl',
						params:data,
					})
					.then((res)=>{
						// console.log(res);
						that.errcode = res.data.errcode;
						if(res.data.errcode == 0 || res.data.errcode == '0'){
							var data = res.data.data;
							that.hits = data.hits;
							that.live_status = data.live_status;   //1 未开始  2正在直播
							that.description = data.description;
							// console.log(data);
							$('title').html(data.name);
							that.name = data.name;
							// console.log(that.name)
	
							that.shareclick(data.name,data.thumb);
	
	                        if((this.zbo==1||this.zbo=='1')&&(data.type==1||data.type==1)){
							   var str = data.video_url;
							}else{
							  var str = data.demand_url;
							}
							var demand_url = Base64.decode(str);
							// var demand_url = Base64.decode('PHAgc3R5bGU9ImRpc3BsYXk6YmxvY2siPjxpZnJhbWUgZnJhbWVib3JkZXI9IjAiIGhlaWdodD0iNDAwIiBzcmM9Imh0dHA6Ly95dW50di5sZXR2LmNvbS9iY2xvdWQuaHRtbD91dT1oN3hwZ2lqY294JmFtcDt2dT1mNzQ0NGY3ZTFlJmFtcDtwdT0yNzYxZjg5MzUxJmFtcDthdXRvX3BsYXk9MSZhbXA7d2lkdGg9MTAwJSZhbXA7aGVpZ2h0PTQwMCZhbXA7bGFuZz16aF9DTiIgd2lkdGg9IjEwMCUiPjwvaWZyYW1lPjwvcCA+');
							  this.demand_url = demand_url;
							  // console.log(demand_url)
							// var str = Base64.decode(str);  
							// var demand_url = that.caesarDecryption(str);
							// console.log(demand_url);
							// 视频
							that.live_platform = data.live_platform;
							that.video(demand_url,0,that.live_platform);
							if(localStorage.getItem('token')){
								// 聊天
								that.getuserInfo(data.tis_id,data.description,data.hits);
							}else{
								that.chat(data.tis_id,data.description,data.hits);
							}
							
							//是否签到
							if(that.cid!=''){
								that.is_signed = data.is_signed;  //是否已签到 0 没有 1 签了
								that.is_answered = data.is_answered; //是否答题 0 没有 1 有
								that.test_id = data.exam_id;   //试卷id
								
								// 获取签到时间
								that.register_time = data.sign_time;
								that.answer_time = data.answer_time;   //答题时间
								that.answer_time1 = data.answer_time;   //答题时间
								// that.register_time = parseInt(data.sign_time)*1000;
								// console.log(that.register_time);
								// that.nowdata = parseInt(Date.parse(that.getNowFormatDate()));
								// 获取当前时间  并转为时间戳
								if(that.is_signed==0||that.is_signed=='0'){
									if(that.register_time==0||that.register_time=='0'){
										that.register_time=0;
									}else{
										if(Number(that.register_time)>0){
											that.setTime = setInterval(function(){
												// that.nowdata = register_time;
												that.register_time = Number(that.register_time) -1;
												// console.log(that.register_time);
												if(that.register_time==0||that.register_time=='0'){
													clearInterval(that.setTime);
												}
											},1000)
										}
									}
									
								}else{
									// console.log(8989)
									that.answercli();
								}
							}
							
							
						}
						// console.log(that.teacher);
					}).catch((err)=>{
					   console.log(err)
					})
				},
				answercli(){
					var that = this;
					if(that.answer_time == 0 || that.answer_time == '0'){
					    that.answer_time = 0;
					}else{
						if(Number(that.answer_time)>0){
							that.setTime1 = setInterval(function(){
								that.answer_time = Number(that.answer_time) -1;
								// console.log(that.answer_time);
								if(that.answer_time==0||that.answer_time=='0'){
									clearInterval(that.setTime1);
									// console.log(that.test_id);
								}
							},1000)
						}
					}
				},
				// 点击签到
				registerclick(){
					var that = this;
					// console.log(that.id);
					var thatstate = this.$store.state;
					this.axios({
						method:'get',
						url:thatstate.url+'Live/signed',
						params:{
							class_id:that.cid,
							course_id:that.id
						},
					})
					.then((res)=>{
						// console.log(res);
						if(res.data.errcode == 0 || res.data.errcode == '0'){
							layer.open({
								content: '签到成功',
								skin: 'msg',
								time: 2 //1秒后自动关闭
							});
							that.is_signed = 1;
							that.answercli();
						}else{
							layer.open({
								content: '签到失败',
								skin: 'msg',
								time: 2 //1秒后自动关闭
							});
						}
						// console.log(that.teacher);
					}).catch((err)=>{
					   console.log(err)
					})
				},
				// 点击去答题
				answerclick(){
					var that = this;
					// is_answered 0 没有 1有
					if(that.is_answered == 0 || that.is_answered == '0'){
						that.$router.push({
							path: '/answer?testid='+that.test_id+'&gid='+that.cid+'&zbo='+that.zbo+'&id='+that.id+'',
						})
					}else{
					   $('.datishower').fadeIn();
					}
				},
				// 重新答题
				butclick:function(){
					var that = this;
					$('.datishower').fadeOut();
					that.$router.push({
						path: '/answer?testid='+that.test_id+'&gid='+that.cid+'&zbo='+that.zbo+'&id='+that.id+'&url='+that.$route.query.url+'',
					})
				},
				// 查看解析
				nobutclick:function(){
					var that = this;
					$('.datishower').fadeOut();
					that.$router.push({
						path: '/anslysis?wrong=0&testid='+that.test_id+'&gid='+that.cid+'&zbo='+that.zbo+'&id='+that.id+'&url='+that.$route.query.url+'',
					})
				},
				// 获取个人信息
				getuserInfo:function(tis_id,description,hits){
					var that = this;
					// var thatstate = that.$store.state;
					// 获取个人信息
					this.axios({
						method:'GET',
						url:that.url+'User/getUserInfo',
					})
					.then((res)=>{
						// console.log(res);
						if(res.data.errcode == 0 || res.data.errcode == '0'){
							var getuser = res.data.data;
							that.getUserInfo = getuser;
							
							if(getuser.nickname!=''){
								that.nickname = getuser.nickname;
								that.avatar = getuser.avatar;
							}else{
								if(getuser.nickname1==''){
									that.nickname = getuser.tel;
									that.avatar = that.$store.state.avatarimg;
								}else{
									that.nickname = getuser.nickname1;
									that.avatar = getuser.avatar1;
								}
							}
							
							var tel = getuser.tel;
							that.phone = tel.substr(0,3)+"****"+tel.substr(7);
							that.chat(tis_id,description,hits)
							
						}
					}).catch((err)=>{
					   console.log(err)
					})
				},
				
				video:function(demand_url,try_time,live_platform){
					var that = this;
					// alert(that.zbo)
					// console.log(demand_url)
					// 阿里云
					// var imgurl = that.imgurlzbo+'img/nozhibo.png';
					if(that.zbo==1||that.zbo=='1'){
						// alert(live_platform)
						// console.log(demand_url)
						// 直播没有开始
						// console.log(live_platform);
	// 					if(live_platform==1||live_platform=='1'){    //直播平台  1奥点云  2 阿里云   3七牛云
	// 						
	// 					}
						// if(live_platform==2||live_platform=='2'){	
							var player = new Aliplayer({
								id: 'MPSplayer',
								width: '100%',
								height:'100%',
								// autoplay: true,
								cover:that.imgSrc1,
								// cover:'https://zhibo.qikeya.com/Public/img/xqbanner.png',
								//支持播放地址播放,此播放优先级最高
								source: demand_url,
								autoplay: false,
	                            preload: false,
								// source: 'https://blive.qikeya.cn/xiaoqi/zhengji.m3u8',
								isLive:true,  //播放内容是否为直播，直播时会禁止用户拖动进度条。
								// skinLayout:false,//功能组件布局配置，不传该字段使用默认布局  传false隐藏所有功能组件，请参照皮肤定制。
								videoWidth: "98%",
								
							},function(player){
								player.on('error',function(e) {
								  // console.log(e);
								  // alert(e.type);
								  if (e.type=="error"||e.type==error){
									player.dispose();
									new Aliplayer({
										"id": "MPSplayer",
										"width": "100%",
										"height": "100%",
										// "cover": "https://zhibo.qikeya.com/Public/img/xqbanner.png",
										cover:that.imgSrc1,
										// "useH5Prism": true
									  }, function (player) {
										// player._switchLevel = 0;
									  }
									);
								  }
								});
						   });
						// }else{ 
						// 	// 奥点云
						// 	var objectPlayer = new mpsPlayer({
						// 		container: 'MPSplayer', //播放器容器ID，必要参数
						// 		uin: '34657', //用户ID
						// 		appId: 'f3b61bzB1zNPSQiS', //播放实例ID
						// 		// hlsUrl: 'https://28008.hlsplay.aodianyun.com/qikeya3/stream.m3u8', //控制台开通的APP hls地址
						// 		// hlsUrl: 'http://pili-live-hls.qikeya.cn/qikeya/qky_wzzb.m3u8', //控制台开通的APP hls地址
						// 		hlsUrl: demand_url, //控制台开通的APP hls地址
						// 		// rtmpUrl: demand_url, //控制台开通的APP rtmp地址
						// 		flvUrl: '', //flv地址
						// 		width: '100%', //播放器宽度，可用数字、百分比等
						// 		height: '100%', //播放器高度，可用数字、百分比等
						// 		autostart: false, //是否自动播放，默认为false
						// 		// adveDeAddr:'https://zhibo.qikeya.com/Public/img/xqbanner.png',
						// 		controlbardisplay: 'enable', //是否显示控制栏，值为：disable、enable默认为disable。
						// 		isclickplay: true, //是否单击播放，默认为false
						// 		isfullscreen: false, //是否双击全屏，默认为true
						// 		mobilefullscreen: false, //移动端是否全屏，默认为false
						// 		enablehtml5: false, //是否优先使用H5播放器，默认为false
						// 		isloadcount: 1, //网络波动卡顿loading图标显示(默认1s后)
						// 		isdefaultfull: true,
						// 	});
						// }
						if(that.try==1||that.try=='1'){
							that.countDownTime(Number(try_time)*60,that);
							that.timer1 = setInterval(function () {
								// console.log(999);
							   if(window.sessionStorage.times){
								   var time = window.sessionStorage.getItem('times');
								   if(time == 0||time == '0'){
									   clearInterval(that.timer1);
									   clearInterval(that.timer);
									   $('.shoewr-chenshi').fadeIn();  
								   }
							   }
						   },1000)
						}
					}else{
						var player = new Aliplayer({
							id: 'MPSplayer',
							width: '100%',
							height:'100%',
							// autoplay: true,
							autoplay: false,
	                        preload: false,
							//支持播放地址播放,此播放优先级最高
							source: demand_url,
							cover:that.imgSrc1,
							videoWidth: "98%",
						},function(player){
							// console.log('播放器创建好了。');
							// console.log(that.try);
							that.despayer  = player;
							player.on('play',function(e) {
								// player.play();
								that.getDuration = player.getDuration();
								// console.log(that.getDuration);
							});
							that.getDurationtime(player,try_time);
					   });
					}
				   
				},
				getDurationtime(player,try_time){
					var that = this;
					if(that.try==1||that.try=='1'){
						that.countDownTime(Number(try_time)*60,that);
						that.timer1 = setInterval(function () {
							// console.log(999);
						   if(window.sessionStorage.times){
							   var time = window.sessionStorage.getItem('times');
							   // console.log(time);
							   if(time == 0){
								   // console.log(111);
								   clearInterval(that.timer1);
								   clearInterval(that.timer);
								   player.pause();
								   player.on('play',function(){
									player.pause();
									$('.shoewr-chenshi').fadeIn();  
								  });  
							   }
						   }
					   },1000)
					}
				},
				// 倒计时
				countDownTime:function(times,that) {
				   // console.log(999);
				   that.timer = setInterval(function () {
				    // window.sessionStorage.setItem('daotime',times);
					
					var timestamp = Date.parse(new Date());
					timestamp = timestamp / 1000;
				
					var day = 0,
					   hour = 0,
					  minute = 0,
					  second = 0; //时间默认值
					if (times > 0) {
					  day = Math.floor(times / (60 * 60 * 24));
					  hour = Math.floor(times / (60 * 60)) - (day * 24);
					  minute = Math.floor(times / 60) - (day * 24 * 60) - (hour * 60);
					  second = Math.floor(times) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
					}
					if (day <= 9) day = '0' + day;
					if (hour <= 9) hour = '0' + hour;
					if (minute <= 9) minute = '0' + minute;
					if (second <= 9) second = '0' + second;
					
					that.time = minute + "分" + second + '秒'
					
					times--;
					that.times = times;
					window.sessionStorage.setItem('times',times);
				    // console.log(times);
					if (times == 0) {
					  clearInterval(that.timer);
					}
				  }, 1000);
				},
				// 学习进度
				upload(id,rate){
					var that = this;
					// console.log(that.cid)
					if(that.cid!=''){   //班级
						var data = {
							course_id:id,
							classroom_id:that.cid,
							special_id:that.special_id,
							rate:rate
						}
					}else if(that.zid!=''){   //专题
						var data = {
							course_id:id,
							special_id:that.zid,
							rate:rate
						}
					}else{     //课程
						var data = {
							course_id:id,
							rate:rate	
						}
					}
					this.axios({
						method:'get',
						url:that.url+'LiveCourse/uploadLearn',
						params:data,
					})
					.then((res)=>{
						console.log(res);
					})
				},
				// 试看接口
				tryWatch:function(id){
					var that = this;
					that.axios({
						method:'GET',
						url:that.url+'LiveCourse/tryWatch',
						params:{
							id:id,
						},
					})
					.then((res)=>{
						// console.log(res);
						if(res.data.errcode==0||res.data.errcode=='0'){
							var data = res.data.data;
							// if(data.is_watch==0||data.is_watch=='0'){
							$('title').html(data.name);
	                        that.name = data.name;
							that.hits = data.hits;
							that.live_status = data.live_status;   //1 未开始  2正在直播
							that.description = data.description;
							
	
							that.shareclick(data.name,data.thumb);
	
	
	                        that.errcode = 0;
							if((this.zbo==1||this.zbo=='1')&&(data.type==1||data.type==1)){
							   var str = data.video_url;
							}else{
							  var str = data.demand_url;
							}
							that.live_platform = data.live_platform;
							// var str = data.demand_url;
							var demand_url = Base64.decode(str); 
							 this.demand_url = demand_url;
							 this.try_time = data.try_time;
							// console.log(demand_url);
							// var demand_url = that.caesarDecryption(str);
							that.video(demand_url,data.try_time,that.live_platform);
							// that.description = res.data.data.data.description;
							// 聊天
							// data.tis_id,data.description,data.hits
							that.getuserInfo(data.tis_id,data.description,data.hits);
	// 						}else{
	// 							that.errcode = -1;
	// 						}
						}else{
							that.errcode = -1;
							$('.shoewr-chenshi').fadeIn();  
						}
	
					}).catch((err)=>{
					   console.log(err);
					})
				},
				shareclick(name,thumb){
					var that = this;
					// var url =window.location.href;
					var url1 = window.location.href.split(':')[0];
					var link =url1+ this.$store.state.linkurltap + that.$route.query.url;
					// console.log(link);
					// var url =url1+ this.$store.state.linkurltap;
					var url = window.location.href;
					var obj = {
						title:name,		//分享标题
						desc: that.$store.state.desc,						//分享内容
						linkurl: link,//分享链接
						img: that.$store.state.img+thumb,
					}
					this.sdk.getJSSDK(url,obj,that.url)
				},
				chat:function(tis_id,description,hits){
					var that = this;
					var data ={
						tisId:tis_id
					}
					// console.log(8989)
					// var api = TISAPI.New(
	// 				this.axios.post(this.$store.state.url + "TisApi/tisInterface",data), false); 
					var api = TISAPI.New(that.url+'TisApi/tisInterface', { tis_id: tis_id}); 
					if(that.nickname==''){
						that.nickname = that.phone;
					}
	
					window.tis = TIS(".tis-container", {
						api: api,                               //必须
						//clientid:"clientId1"                  //可选，默认随机生成
						hits: "",
						name: that.nickname,                           //可选，默认为Anonymous
						image: that.avatar,          //可选，默认未定义
						generateUserEvent: true,                //可选，默认为true
						template: tis_perty_ui,                //界面模版
						//以下均可选
						failure: function (error, when) {       //某个操作失败时调用
						  console.log(error)
							if (typeof error != "string") {
								if (when == "sendMsg" && error.code == 400 && error.error == "instance closed") {
									//alert("TIS实例已关闭");
									return;
								}
								// alert(when + "操作失败");
							} else {
								// alert("操作失败：" + error);
							}
						},
						onSendSuccess: function (data) {
							//当发送消息成功时调用
							console.log("消息发送成功");
						},
						onReconnect: function () {
							//当需要与服务器重新连接时调用
							console.log("正在与服务器重连");
						},
						onConnect: function () {
							//当与服务器连接成功时调用
							console.log("与服务器重连接成功");
						},
						onLoadComponent: function () {
							//当组件加载完成时调用
							console.log("组件加载完成");
							// $(".boxContent").html(description);
							$('.tis-sendBtn').click(function(){
										  // console.log(8008);
							  // setLocation
							  // var one1 = localStorage.setItem('one');
							  if(window.localStorage.token){
							    // console.log(666)
							  }else{
							    // console.log(798989);
							    $('.shoewr-chenhoupass').fadeOut();
							  }
							})
	
						},
						updateUser: function (total, clientId) {
							this.hits = Number(total)+Number(this.hits);
							//当generateUserEvent=true,并且在线人数发生变化时调用
				//				console.log("在线人数:", total);
							// $('.tis-top-name').html(Number(total)+Number(hits));
						}
					});
				},
	// 			loadBottom(){
	// 				this.allLoaded = true;// if all data are loaded
	// 				
	// 				this.page++;
	// 				this.noteList(1);
	// 			},
				changeTab () {
				  this.tab0.list = []// 在这里手动置空列表,可显示加载中的请求进度
				  this.getTabData(0).mescroll.resetUpScroll() // 刷新列表数据
				},
				// 获取菜单对应的数据
				getTabData () {
				   return this.tab0;
				},
				
				mescrollInit0 (mescroll) {
				  this.tab0.mescroll = mescroll;
				},
				getMescrollUp (tabType) {
					// let emptyWarpId = 'dataList0';
				  return {
				    auto: true,
				    callback: this.upCallback, // 上拉回调,此处可简写; 相当于 callback: function (page) { upCallback(page); }
				    noMoreSize: 5, // 如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
					 empty: {
					  warpId: 'dataList', // 父布局的id;
					  icon: this.imgSrc3, // 图标,默认null
					  tip: '暂时没有找到您所需要的内容…', // 提示
					  
					},
				    
				  }
				},
				upCallback (page, mescroll) {
					var that = this;
					if(that.cid!=''){   //班级
						var data = {
							course_id:that.id,
							classroom_id:that.cid,
							special_id:that.special_id,
							type:3,
							page:page.num,
							limit:page.size
					
						}
					}else if(that.zid!=''){   //专题
						var data = {
							course_id:that.id,
							special_id:that.zid,
							type:2,
							page:page.num,
							limit:page.size
						}
					}else{     //课程
						var data = {
							course_id:that.id,
							type:1,
							page:page.num,
							limit:page.size
						}
					}
					// setTimeout(function(){
					that.axios({
						method:'get',
						url:that.url+'Note/noteList',
						params:data,
					}).then(res=>{
						if(res.data.errcode==0||res.data.errcode=='0'){
							var curPageData = res.data.data.lists;
							mescroll.endSuccess(curPageData.length);// 联网成功的回调,隐藏下拉刷新和上拉加载的状态;
							 if (page.num === 1) this.tab0.list = []; // 如果是第一页需手动制空列表
							 this.tab0.list = this.tab0.list.concat(curPageData); // 追加新数据
							 // console.log(this.tab0.list)
					    }else{
							mescroll.endErr()
						}
					})
				},
				
				bijizan(id,is_praise,index){
					var that = this;
					if(localStorage.token){
						that.axios({
							method:'get',
							url:that.url+'Note/likeNote',
							params:{
								note_id:id
							},
						}).then((res)=>{
							if(res.data.errcode==0||res.data.errcode=='0'){
								if(is_praise==0||is_praise=='0'){
									layer.open({
										content: '点赞成功',
										skin: 'msg',
										time: 2 //1秒后自动关闭
									});
									that.tab0.list[index].is_praise = 1;
									that.tab0.list[index].praise = Number(that.tab0.list[index].praise) + 1;
									// vue.set(that.bijiarr,index,)
								}else{
									that.tab0.list[index].is_praise = 0;
									that.tab0.list[index].praise = Number(that.tab0.list[index].praise) - 1;
								}
							}else{
								layer.open({
									content: res.data.msg,
									skin: 'msg',
									time: 2 //1秒后自动关闭
								});
							}
						})
					}else{
						$('.shoewr-chenhoupass').fadeIn();
					}
				},
				
			},
			beforeDestroy(){
				var that = this;
				// if((that.zbo!=1||that.zbo!='1')&&(that.try!=1||that.try!='1')&&(that.code=='')){
				// if((that.zbo!=1||that.zbo!='1')&&(that.try!=1||that.try!='1')&&(that.code=='')||that.answtype!=1||that.answtype!='1'){
						
					var despayer = that.despayer;
					if(despayer!=''){
						if((that.try!=1||that.try!='1')&&(that.code=='')&&(that.answtype==0||that.answtype=='0')){
							that.getDuration = despayer.getDuration();
							var getCurrentTime = despayer.getCurrentTime();
							var rate = (Math.round(Number(getCurrentTime)/Number(that.getDuration)*100));
							that.upload(that.id,rate);
						}
					}
				// }
			},
			destroyed(){
				var that = this;
				clearInterval(that.timer); 
				clearInterval(that.timer1);
				clearInterval(that.setTime1);
				clearInterval(that.setTime);
	            window.sessionStorage.removeItem('times');
			},
			mounted() {
				var that = this;
				
// 				const s = document.createElement('script');
// 				s.type = 'text/javascript';
// 				s.src = 'static/js/aliyun.js';
// 				document.body.appendChild(s);
				
				// that.urlhtml = '../../assets/demand.html';
				
				// that.id = that.$route.query.id;
				that.id = that.$route.query.id;
				// console.log(that.id);
				if(that.$route.query.y){
					that.code = that.$route.query.y;   //邀请码
				}else{
					that.code = '';
				}
				if(that.$route.query.cid){
					that.cid = that.$route.query.cid;   //班级id
					that.special_id = that.$route.query.special_id;   //班级id
				}else{
					that.cid = '';
				}
				
				if(that.$route.query.zid){
					that.zid = that.$route.query.zid;   //专题id
				}
				// console.log(that.cid)
				
				if(that.$route.query.type){
					that.type = that.$route.query.type;   //1课程
				}
				
				if(that.$route.query.answtype){
					that.answtype = that.$route.query.answtype;   //1课程
				}
				
				// answtype
				// that.countDownTime(10,that);
				if(that.$route.query.try){
					that.try = that.$route.query.try;   //试看   1试看  0否
					// that.tryWatch(that.id,that.uid);
				}else{
					that.try = 0;
				}
				
				// that.countDownTime(10,that);
				if(that.$route.query.zbo){
					that.zbo = that.$route.query.zbo;   //试看   1直播  0否
					// that.tryWatch(that.id,that.uid);
				}else{
					that.zbo = 0;
				}
				
				
				// console.log(that.$route.query.try);
				if(that.try==1||that.try=='1'){
					that.tryWatch(that.id);
				}else{
					// 获取视频链接
					that.getvideo(that.id);
				}
				
				// that.noteList(0);
				
				// <!-- 边看边聊切换 -->
	  
				var h = document.documentElement.clientHeight || document.body.clientHeight;
				var height = h * 0.6;
				var he = h - 240;
				// console.log(height);
				$("div.boxContent,.chat-box,.descor").css('height',height).css("overflow-y","scroll");
				$('.chat-box').css('height',he);
				$('.descor').hide();
				// $('.descor').css('height',height).css("overflow-y","scroll");
				$(".tablea").find(".box:first").show();
	// 			$("#oranger a").on("click", function() {
	// 				var index = $(this).index();
	// 				$('.orangerdesc').find('.descoactive').eq(index).show().siblings('.descoactive').hide();
	// 				
	// 				$(this).addClass("hover").siblings().removeClass("hover");
	// 			})
			},
			
		}
</script>

<style scoped="scoped">
	/* .mescroll {
	  position: fixed;
	  bottom: 0;
	  height: auto;
	} */
	/* .descoactive1 p{
		width: 100% !important;
		height: 100% !important;
	} */
	#descoactive1 img{
		width: 100% !important;
		height: 100% !important;
	}
	/* .descor img{
		width: 100% !important;
		height: 100% !important;
	} */
	/* 笔记 */
	.descorevery{
		margin-top: .3rem;
		display: flex;
		justify-content: flex-start;
		border-bottom: 1px solid #EDEDED;
		padding-bottom: .3rem;
	}
	.descopic{
		width: .54rem;
		height: .54rem;
		border-radius: 50%;
		overflow: hidden;
	}
	.descopic img{
		width: 100%;
		height: 100%;
	}
	.descotime{
		width: 6rem;
		margin-left: .2rem;
	}
	.descname{
		color: #333333;
		font-size: .24rem;
	}
	.descname-time{
		color: #C2C9D3;
		margin-top: .1rem;
	}
	.desccontent{
		color: #333333;
		font-size: .24rem;
		margin-top: .3rem;
	}
	.desczan{
		margin-top:.18rem;
		display: flex;
		justify-content: flex-end;
	}
	.desczan img{
		width: .27rem;
		height: .27rem;
	}
	.desczan span{
		display: inline-block;
		font-size: .22rem;
		margin-left: .07rem;
	}
	.desczan .zan{
		color: #999999;
		
	}
	.desczan .zanactive{
		color: #0287FF;
	}
	
	
  >>>.van-hairline--top-bottom::after{
    border-width: 0 0;
  }
  >>>.van-tabs__wrap{
    box-shadow:0px 3px 5px 0px rgba(71,68,80,0.06);
  }
  >>>.van-tabs__nav{
    width: 80%;
  }
  .bj{
    width: 1rem;
    position: fixed;
    bottom: 0.8rem;
    right: 0.3rem;
    z-index: 9;
  }
  .pinglun{
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 0.88rem;
    background:rgba(255,255,255,1);
    box-shadow:0 -3px 5px 0px rgba(71,68,80,0.06);

  }
  .pinglun img{
    width: 0.56rem;
  }
  .pinglun input{
    width:5.06rem;
    height:0.56rem;
    background:rgba(240,240,240,1);
    border:0.02rem solid rgba(237,237,237,1);
    border-radius:0.28rem;
    text-indent: 0.3rem;
  }
  .pinglun button{
    width:0.88rem;
    height:0.56rem;
    background:rgba(2,135,255,1);
    border-radius:0.28rem;
    font-size:0.24rem;
    color:rgba(255,255,255,1);
    line-height:0.32rem;
    border: none;
    outline: none;
  }
  .numberYan{
    position: absolute;

    top: 0.26rem;
    right: 0.3rem;
  }
  .numberYan img{
    width: 0.32rem;
    vertical-align: middle;
  }
  .numberYan span{
    font-size:0.24rem;
    color:rgba(194,201,211,1);
    line-height:0.32rem;
    vertical-align: middle;
  }
  .kong{
    width: 2.8rem;
    margin-top: 36%;
  }
  .paihang{
    width: 1rem;
    position: fixed;
    bottom: 2.8rem;
    right: 0.3rem;
    z-index: 9999;
  }
  .dati{
    width: 1rem;
    position: fixed;
    bottom: 1.6rem;
    right: 0.3rem;
    z-index: 9999;
  }
  .top{
    width: 100%;
    height: 1.15rem;
    position: relative;
    overflow: hidden;
  }
  .top img{
    width: 0.5rem;
    position: absolute;
    right: 0.2rem;
    top: 0.2rem;
  }
  .top p{
    font-size:0.36rem;
    font-weight:bold;
    color:rgba(51,51,51,1);
    text-align: center;
    margin-top: 0.4rem;
  }
  .center{
    width: 88%;
    height: 0.6rem;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.3rem;
  }
  .descor{
	  padding: .3rem;
  }
  .left{
    display: flex;
    align-items: center;
  }
  .one{
    width: 0.28rem;
  }
  .people{
    width: 0.6rem;
    height: 0.6rem;
    margin-left: 0.15rem;
  }
  .p1{
    width: 0.28rem;
    text-align: center  ;
    font-size:0.32rem;
    font-weight:bold;
    color:rgba(153,153,153,1);
  }
  .p2{
    font-size:0.28rem;
    color:rgba(51,51,51,1);
    margin-left: 0.15rem;
  }
  .right{
    font-size:0.28rem;
    color:rgba(153,153,153,1);
  }
  .btom{
    width: 100%;
    height: 1.68rem;
    background: #0287FF;
    overflow: hidden;
  }
  .btom p{
    width: 6rem;
    margin: auto;
    color: #C0DDFC;
    font-size: 0.26rem;
    line-height: 0.46rem;
    margin-top: 0.15rem;
  }
  .biji{
    width: 88%;
    margin: auto;
    overflow: hidden;
  }
  .biji p{
    font-size:0.36rem;
    font-weight:bold;
    color:rgba(51,51,51,1);
    margin-top: 0.5rem;
  }
  .bijicolo{
  	/* position: relative; */
	/* height: 2.95rem; */
  }
  .textbiji{
  	color: #999999;
  	font-size: .26rem;
  	display: flex;
  	justify-content: flex-end;
  	/* position:absolute; */
	/* bottom: .28rem;
	right: .28rem; */
  }
  .biji textarea{
	/* position:absolute; */
    width: 100%;
    height: 2.95rem;
    border-radius:0.1rem;
    margin-top: 0.3rem;
    background:rgba(247,247,247,1);
    border: none;
    resize:none;
    text-indent: 0.3rem;
    padding: 0.3rem;
  }
  .biji textarea::placeholder{
    font-size:0.26rem;
    color:rgba(153,153,153,1);
    line-height:0.32rem;
	
  }
  .btons{
    margin-top: 0.3rem;
    display: flex;
    justify-content: space-between;
  }
  .btons button{
    width:2.8rem;
    height:0.7rem;
    background:rgba(204,204,204,1);
    border-radius:0.35rem;
    font-size:0.28rem;
    font-weight:bold;
    color:rgba(255,255,255,1);
    border: none;
    outline: none;
  }
  .btons button:nth-child(1){
    background:rgba(204,204,204,1);
  }
  .btons button:nth-child(2){
    background:#0287FF;
  }
.wrong{
	text-align: center;
	width: 100%;
	margin-top: 10px;
	color: #333;
	font-size: 14px;
	position: fixed;
	z-index: 9999999;
}
.video-c{
	width: 100% !important;
	height: 4.25rem !important;
}
.prism-player video{
	z-index: 1 !important;
}
#MPSplayer{
	width: 100%;
	height:100% !important;
	background-size:100% 100%;
	position: relative;
	z-index: 1;
}
>>>.prism-cover{
    background-size:100% 100%;
  }
  .video-pic{
	  width: 7.5rem;
	  height: 4.25rem;
  }
  .video-pic img{
	   width: 100%;
	   height: 100%;
  }
.shower{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	z-index: 99;
	background: rgba(0,0,0,.6);
	display: none;
}
.con{
	width: 80%;
	position: relative;
	top: 230px;
	background: #fff;
	left: 50%;
	margin-left: -40%;
	font-size: 16px;
	color: #333;
	border-radius: 8px;
}
.con .conend{
	padding: 20px 0;
	text-align: center;
	border-bottom: 1px solid #EDEDED;
}
.con .conbut{
	height: 44px;
	line-height: 44px;
	text-align: center;
}
.centera {
	background: #fff;
	position: relative;
	overflow: hidden;
}

.tab_liveTxt {
	display: flex;
	display: -webkit-flex;
	border-bottom: 1px #eee solid;
	justify-content: space-around;
	box-shadow:0px 0.03rem 0.05rem 0px rgba(71,68,80,0.06);
}
.orangerleft{
	width: 80%;
	display: flex;
	justify-content: space-around;
}

.tab_liveTxt a {
	display: block;
	font-size: 14px;
	line-height: 40px;
	color: #000;
	text-decoration: none;
	/* padding: 0 15px; */
}
.tab_liveTxt  img{
	width: .32rem;
	height: .32rem;
	display: inline-block;
	margin-top: .22rem;
}
.tab_liveTxt .orangerright span{
	display: inline-block;
	line-height: 40px;
	color: #C2C9D3;
	font-size: .24rem;
	margin-left: .08rem;
}

.tab_liveTxt a.hover {
	color: #0287FF;
	border-bottom: 2px #0287FF solid;
}

.box {
	display: none;
}

.boxContent {
	padding: 0px 10px;
}

.boxContent img {
	max-width: 100%;
}

.tis-top-bar {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	height: 40px;
	line-height: 40px;
	z-index: 9999;
}

.tis-top-bar .tis-top-name {
	width: 42px;
}

.chat-box {
	height: 60%;
	width: 100%;
	margin: auto;
	/* filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=3);
	-moz-box-shadow: 2px 2px 10px #909090;
	-webkit-box-shadow: 2px 2px 10px #909090;
	box-shadow:2px 2px 10px #909090; */
	border-radius:.1rem;
}
.chat-box .tis-bottom-panel{
	position: fixed;
	bottom: 0px;
	padding-top: 5px;
	z-index: 99999;
	display: block;
}
.chat-box .tis-top-bar .fa-eye{
	margin-top: 14px;
	margin-right: 2px;
}
  .r{
    background: #fff;
    overflow: hidden;
  }
  .doctor{
    width: 92%;
    margin: auto;
    margin-top: 0.3rem;
  }
  .docImg{
    width: 0.54rem;
    height: 0.54rem;
    border-radius: 50%;
    vertical-align: top;
  }
  .content{
    width: 87%;
    display: inline-block;
    margin-left: 0.2rem;
  }
  .content p:nth-child(1){
    font-size: 0.24rem;
    color:rgba(51,51,51,1);
  }
  .content p:nth-child(2){
    color: #C2C9D3;
    font-size: 0.24rem;
    line-height: 0.32rem;
  }
  .content p:nth-child(3){
    font-size: 0.24rem;
    color: #333;
    margin-top: 0.2rem;
    line-height: 0.32rem;
  }
  .content p:nth-child(4){
    margin-top: 0.15rem;
    float: right;
  }
  .content p:nth-child(4) img{
    width: 0.27rem;
    vertical-align: middle;
  }
  .bluezan{
    font-size:0.22rem;
    color:rgba(2,135,255,1);
    line-height:0.19rem;
    vertical-align: middle;
  }
  .grayzan{
    font-size:0.22rem;
    color:#C2C9D3;
    line-height:0.19rem;
    vertical-align: middle;
  }
</style>
